function dateDiff ( d ) {
    var date0 = new Date( d );
    var days = 0;

    var sDiff = Math.round(((new Date()) - date0)/1000);
    if ( sDiff >= 1 )
        days = Math.floor(sDiff/86400);

    return days + 1;
}


var mdayl = dateDiff ('July 20, 1989 12:16:00'   );
var ddayl = dateDiff ('March 24, 1992 10:00:00'  );
var daysm = dateDiff ('February 19, 2011 4:00:00');
var daymi = dateDiff ('May 16, 2012 18:15:00'    );
var daysd = dateDiff ('June 15, 2012 20:00:00'   );

var width  = 206;
var height =  48;

var c=document.getElementById("canvas");
var ctx=c.getContext("2d");

var unb = "#D9D9D9";
var nkn = "#E6B3AC";
var ibf = "#EDD182";
var irl = "#D8ED82";
var bge = "#A1ED82";

ctx.fillStyle = unb;
ctx.fillRect(0, 0, width, height);

ctx.fillStyle = nkn;
var dd  = mdayl - ddayl;
var ofs = (dd * width) / mdayl;
ctx.fillRect(0, 0, width, height/2);                // yo
ctx.fillRect(ofs, height/2, width - ofs, height/2); // dam

ctx.fillStyle = ibf;
dd = mdayl - daysm;
ofs = (dd * width) / mdayl;
ctx.fillRect(ofs, 0, width - ofs, height);

ctx.fillStyle = irl;
dd = mdayl - daymi;
ofs = (dd * width) / mdayl;
ctx.fillRect(ofs, 0, width - ofs, height);

ctx.fillStyle = bge;
dd = mdayl - daysd;
ofs = (dd * width) / mdayl;
ctx.fillRect(ofs, 0, width - ofs, height);
